<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>

<body>

    <button id="1">按钮20</button>
    <button id="2">按钮40</button>
    <button id="3">按钮60</button>
    <p>按钮</p>

    <script>
        var p = document.querySelector('p');
        makeSize = (size) => {
            //根绝传过来的参数设置字体大小
            return () => {
                // document.body.style.fontSize = size + 'px';
                p.style.fontSize = size + 'px';
                console.log(size + 'px');
            }
        }

        var size12 = makeSize(12);
        var size16 = makeSize(18);
        var size20 = makeSize(24);

        document.getElementById('1').onclick = size12;
        document.getElementById('2').onclick = size16;
        document.getElementById('3').onclick = size20;
    </script>
</body>

</html>